<template>
  <van-cell
    :title="name"
    :label="artName + '\xa0\xa0\xa0\xa0' + name"
    center
    @click="playSong"
  >
    <!-- 自定义播放图标 -->
    <template>
      <van-icon name="play-circle-o" size="0.6rem"></van-icon>
    </template>
  </van-cell>
</template>

<script>
import { mapMutations } from "vuex";
export default {
  props: {
    name: String,
    artName: String,
    songId: Number,
    albUrl: String,
  },
  methods: {
    ...mapMutations(["setSongInfo"]),
    // 播放音乐
    playSong() {
      this.setSongInfo({
        songName: this.name,
        artName: this.artName,
        albUrl: this.albUrl,
      });
      this.$router.push({
        path: "/playSong",
        query: {
          songId: this.songId,
        },
      });
    },
  },
};
</script>

<style scoped>
.van-cell {
  border-bottom: 1px solid lightgray;
}
</style>
